<template>
	<view>
		<view class="cu-modal top-modal" :class="isShow?'show':''">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end flex align-center">
					<view class="content text-s3" style="width: 100%;">{{title}}</view>
					<view class="action" @tap="close">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl text-xs bg-white">
					<view v-if="type == 'nickname'">
						<input type="nickname" :value="nicknameData.nickname" @blur="nicknameBlur" maxlength="10"
							placeholder="请输入昵称" class="solids bg-gray text-left plr-2"
							style="height: 80rpx;" />
					</view>
					<view v-else>
						{{content}}
						<slot name="content"></slot>
					</view>
				</view>
				<view class="cu-bar bg-white" v-if="isFoot">
					<button v-if="isCancel" class="cu-btn text-c1 bg-white flex-sub text-s3"
						style="width: 100%;height: 100rpx;"
						@tap="isShow = false">{{cancelText}}</button>
					<button class="cu-btn bg-white text-blue flex-sub text-s3"
						style="width: 100%;height: 100rpx;"
						@tap="confirmClick">{{confirmText}}</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "gz-modal",
		data() {
			return {
				isShow: false,
				isCancel: false,
				isFoot: true,
				title: "",
				content: "",
				cancelText: "",
				confirmText: "",
				success: null,
				type: "",
				nicknameData: {
					nickname: ""
				},
				isCheck:false
			};
		},
		methods: {
			open(options) {
				if (!options) {
					options = {}
				}
				if (options.title) {
					this.title = options.title
				} else {
					this.title = `提示`
				}
				if (options.content) {
					this.content = options.content
				} else {
					this.content = ""
				}
				if (options.confirmText) {
					this.confirmText = options.confirmText
				} else {
					this.confirmText = `确认`
				}
				if (options.cancelText) {
					this.cancelText = options.cancelText
				} else {
					this.cancelText = `取消`
				}
				if (options.isCancel) {
					this.isCancel = options.isCancel
				} else {
					this.isCancel = false
				}
				if (options.isFoot) {
					this.isFoot = options.isFoot
				} else {
					this.isFoot = true
				}
				if (options.type) {
					this.type = options.type
					if (options.type == 'nickname') {
						this.nicknameData.nickname = ""
						this.isCancel = true
					}
				} else {
					this.type = ``
				}
				
				this.success = options.success
				
				if(options && options.isCheck){
					this.isCheck = options.isCheck
				}else{
					this.isCheck = false
				}

				this.isShow = true
			},
			close() {
				this.isShow = false
			},
			nicknameBlur(e) {
				console.info("nicknameBlur", e)
				this.nicknameData.nickname = e.detail.value
			},
			confirmClick() {
				if (this.type == "nickname") {
					if (!this.nicknameData.nickname) {
						uni.$common.modalInfo("请输入昵称")
					} else {
						uni.$api.userUpdInfo({
							nickName: this.nicknameData.nickname
						}).then(res => {
							uni.$common.toastSuc("已保存", () => {
								uni.$common.setStoFieldValue("userInfo","nickName",this.nicknameData.nickname)

								if (uni.$common.isNotNull(this.success)) {
									this.isShow = false
									this.success(this.nicknameData.nickname, )
								}
							})
						})
					}
				} else {
					if(this.success){
						if(this.isCheck === true){
							setTimeout(()=>{
								let result = this.success()
								if(result === true){
									this.isShow = false
								}
							},300)
						}else{
							setTimeout(()=>{
								this.success()
							},300)
						}
					}
				}

			}
		}
	}
</script>

<style scoped lang="scss">

</style>